<!DOCTYPE html>
<html>
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <meta charset="utf-8" />
    <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <link href="/css/page/prize.css" type="text/css" rel="stylesheet" />
    <title></title>
</head>
<body style="background-image: url('/upload/images/bg.png');">

<ul id="egg">
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
    <li><img class="egg_0" src="/img/egg.png" /><img class="egg_1" src="/img/egg_1.png" /><img class="hammer" src="/img/hammer.png" /></li>
</ul>
<div id="lottery" style="display: none;">
    <ul class="prizeList">
        <li class="pz1">一等奖</li>
        <li class="pz2">二等奖</li>
        <li class="pz3">三等奖</li>
        <li class="pz4">四等奖</li>
        <li class="pz5">五等级</li>
        <li class="pz6">六等奖</li>
        <li class="pz7">没中奖</li>
    </ul>
</div>
<script src="/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="/js/lottery.jquery.js"></script>
<script type="text/javascript" src="/js/probability.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript"></script>
<script type="text/javascript">

    wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: '<%= weixin.appid %>', // 必填，公众号的唯一标识
        timestamp: '<%= weixin.timestamp %>', // 必填，生成签名的时间戳
        nonceStr: '<%= weixin.noncestr %>', // 必填，生成签名的随机串
        signature: '<%= weixin.signature %>',// 必填，签名，见附录1
        jsApiList: [<%- weixin.jsApiList %>]
    });

    wx.ready(function(){

        wx.checkJsApi({
            jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
            success: function(res) {
                // 以键值对的形式返回，可用的api值true，不可用为false
                // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
            }
        });
        wx.onMenuShareTimeline({
            title: '砸金蛋，赢iPhone7', // 分享标题
            link: 'http://www.5332729.com/index', // 分享链接
            imgUrl: 'http://www.5332729.com//img/getheadimg.jpeg', // 分享图标
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });


        wx.onMenuShareAppMessage({
            title: '砸金蛋，赢iPhone7', // 分享标题
            desc: '新用户在活动页面注册福州航空，有机会赢取最新iPhone7和iPad Air', // 分享描述
            link: 'http://www.5332729.com', // 分享链接
            imgUrl: 'http://www.5332729.com/img/getheadimg.jpeg', // 分享图标
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });

    });

    wx.error(function(res){
        // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。

    });

    var prob = [<%- odds %>];
    var titles = ["一等奖", "二等奖", "三等奖", "四等奖", "没中奖"];
    $('#egg li').on('touchstart', function(){
        this.tap = true;
    }).on('touchmove', function(){
        this.tap = false;
    }).on('touchend', function(){
        if(this.tap){
            $('#egg li').off('touchend');
            $(this).addClass('on');
            var that = $(this);
            window.setTimeout(function(){
                that.find('img.hammer').animate({opacity: 0}, 200, function(){
                    next.call(that);
                });
            },1000);

            var next = function(){
                this.find('.egg_1').animate({opacity: 1}, 300, function(){
                    var lotIndex = new Probability(prob).get();
                    $("#lottery").lottery({
                        lotIndex: lotIndex
                    });
                });

            };
        };
    });
</script>
</body>
</html>